{extend name="../../base/view/common/base" /}
{block name="style"}
<style>
    .layui-form-item .layui-form-label {
        width: 120px;
        text-align: right;
    }
    .layui-form-item .layui-input-block {
        margin-left: 140px;
    }
    .layui-form-mid {
        display: inline-block;
        vertical-align: middle;
        width: 220px;
    }
    .address-field {
        width: 400px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
</style>
{/block}
<!-- 主体 -->
{block name="body"}
<div class="layui-card p-page">
    <div class="layui-card-header">
        <h3>当事人详情</h3>
    </div>
    <div class="layui-card-body">
        <div class="layui-form-item">
            <label class="layui-form-label">当事人名称：</label>
            <div class="layui-form-mid">{$detail.name|default=''}</div>
            <label class="layui-form-label">类型：</label>
            <div class="layui-form-mid">{$detail.party_type == 1 ? '个人' : '企业'}</div>
            {if condition="$detail.party_type != 1"}
            <label class="layui-form-label" style="margin-left: 20px;">法人：</label>
            <div class="layui-form-mid">{$detail.legal_person|default=''}</div>
            {/if}
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">证件号码：</label>
            <div class="layui-form-mid">{$detail.id_number|default=''}</div>
            <label class="layui-form-label" style="margin-left: 20px;">联系人：</label>
            <div class="layui-form-mid">{$detail.contact|default=''}</div>
            <label class="layui-form-label" style="margin-left: 20px;">联系电话：</label>
            <div class="layui-form-mid">{$detail.phone|default=''}</div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">联系地址：</label>
            <div class="layui-form-mid address-field">
                {$detail.province_name|default=''}{$detail.city_name|default=''}{$detail.district_name|default=''}{$detail.address|default=''}
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">创建时间：</label>
            <div class="layui-form-mid">{$detail.create_time|date='Y-m-d H:i:s'|default=''}</div>
            <label class="layui-form-label" style="margin-left: 20px;">更新时间：</label>
            <div class="layui-form-mid">{$detail.update_time|date='Y-m-d H:i:s'|default=''}</div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">关联案件数：</label>
            <div class="layui-form-mid">{$detail.case_count|default='0'}</div>
        </div>
    </div>
</div>

<div class="body-table layui-tab layui-tab-brief bg-white" lay-filter="partyTab" id="partyTab">
    <ul class="layui-tab-title border">
        <li class="layui-this" data-load="true">关联案件</li>
        <li>关联合同</li>
    </ul>
    <div class="layui-tab-content" style="padding:0;">
        <div class="layui-tab-item  layui-show">
            {include file="/party/view_lawcase" /}
        </div>
        <div class="layui-tab-item">
            {include file="/party/view_contract" /}
        </div>
    </div>
</div>
{/block}

<!-- 脚本 -->
{block name="script"}
<script>
const party_id = '{$id}';
layui.use(['form', 'layer', 'table'], function(){
    var form = layui.form,
        layer = layui.layer,
        element = layui.element,
        table = layui.table;
        initLawcase();
    
    // 监听tab切换事件
    element.on('tab(partyTab)', function(data){
        var index = data.index;
			//if(index === 0) initLawyer();
			if(index === 1) contractInit();
    });
    
    // 初始化合同列表
    function contractInit() {
        // 这里添加合同列表初始化逻辑
        console.log('合同列表初始化');
    }
});
</script>
{/block}
